<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .head{
        margin-top:-50px;
        }
    .head p {
            /* 设置段落字体样式 */
            color: #fffeff;
            font-size: 18px;
            font-weight: 700;
            /* TODO 设置左外边距为320px */
            margin-left:320px;
            /* TODO 设置下外边距为-40px */
            margin-bottom:-40px;
        }

        .head img {
            /* TODO 设置圆角半径为10px */
            border-radius:10px;
            /* TODO 设置左外边距为400px */
            margin-left:400px;
        }
        .pic{
            margin-left:20px;
        }
        .infor{
            width:350px;
            margin-left:100px;
            margin-top:-80px;
        }
        .infor p:first-child{
            
            font-size: 18px;
            color: #606a8e;
            font-weight: 800;
        }
        .time{
            margin-left:5px;
        }

        .time p {
            /* 设置发布时间的字体样式 */
            font-size: 14px;
            color: #b2b2b2;
            margin-bottom: -23px;
        }

        .btn {
            /* 评论按钮位置 */
            border-radius: 5px;
            margin-left: 320px;
        }
        
        .comment {
            width: 360px;
            background-color: slategrey;
            margin-left: 100px;
            margin-top: 20px;
            border-radius: 10px;
        }

        .like {
            line-height: 40px;
            /* TODO 添加一个底部边框，要求：粗细为1px、直线，颜色为#e3e3e3 */
            border-bottom:1px solid #e3e3e3;
        }

        /* TODO 为like类中的img元素设置左外边距，大小为12px */
        .like img{
            margin:12px;
        }
        
        

        .like span {
            /* 点赞人昵称 */
            font-size: 18px;
            color: #62648a;
            padding: 0  6px;
        }

        .reply {
            /* 评论内容 */
            line-height: 40px;
            margin-bottom: 40px;
        }

        .reply span {
            /* 评论人昵称 */
            color: #62648a;
            padding: 0 0 0 6px;
            font-size: 16px;
        }

       

        
    </style>
</head>
<body>
    <div class="container">
        </div>
        <div class="top">
            <img src="D:\Screenshots\微信图片_20240508224654.jpg" width=500px>
        </div>

            <div class="head">
                <p>穏</p>
              <img src="D:\Screenshots\微信图片_20240508224737.jpg" alt="穏" width=80px>
            </div
            <div class="bottom">
           <div class="new">
            <img  class="pic" src="D:\Screenshots\微信图片_20240508224737.jpg" width=60px>
            <div class="infor">
                <p>穏</p>
                <p>六月十七号<br>勇士总冠军</p>
                <img src="D:\Screenshots\微信图片_20240508230747.jpg" alt="勇士总冠军" width=360>
                <div class="time" >
                    <p>1分钟前</p>
                    <img src="http://nocturne.bczcdn.com/img/1654761623364_73980/buttom.png"   height="20px" class="btn">
                    <div class="like">
                        <img src="http://nocturne.bczcdn.com/file/1651820012076_33293/heart.png" width=25px>
                        <span>库里</span>
                        <div class="reply">
                            <p></p><span>库里：</span>下赛季没人想遇到我们</p>
                    </div>
                    </div>
                    </div>
                </div>
            </div>
           </div>
            </div>
            
</body>
</html>